import './App.scss';
import { Router, Route, Switch } from 'react-router-dom';
import AuthRoute from './components/AuthRoute';
import { lazy, Suspense } from 'react';
// import Login from '@/pages/Login';
// import Layout from '@/pages/Layout';
import history from '@/utils/history';
import { Redirect } from 'react-router-dom';

const Login = lazy(() => import("@/pages/Login"))
const Layout = lazy(() => import("@/pages/Layout"))

function App() {
  return (
    <Router history={history}>
      {/* fallback -> 当页面还没加载时 显示在页面上的内容 */}
      <Suspense fallback={<div className="loading">loading...</div>}>
        <div className="app">
          <Switch>
            <Route path="/login" component={Login}></Route>
            <AuthRoute path="/home" component={Layout}></AuthRoute>
            <Redirect path="/" to="/home"></Redirect>
          </Switch>
        </div>
      </Suspense>
    </Router>
  );
}

export default App;
